@import "variables";
@import "mixins";

.alert-message {
  border: 0;
  border-radius: $border-radius;
  margin: 8px 0;
  padding: 5px 8px;
  box-shadow: 0 1px 3px 0 #808080;

  @include alert($color-gray-lighten-30, $color-gray-lighten-70, $color-gray-lighten-30);

  a {
    color: $color-gray-lighten-10;
  }

  a:hover {
    color: $color-gray-lighten-20;
  }

  &.info {
    @include alert($color-blue-darken-10, $color-blue-lighten-45, $color-blue-darken-10);
  }

  &.warning {
    @include alert($color-yellow-darken-25, $color-yellow-lighten-32, $color-yellow-darken-25);
  }

  &.success {
    @include alert($color-green-darken-5, $color-green-lighten-60, $color-green-darken-5);
  }

  &.error,
  &.danger {
    @include alert($color-red-darken-5, $color-red-lighten-40, $color-red-darken-5);
  }
}
